<template>
  <view class="container">
    <uv-swiper
      :list="list"
      previousMargin="30"
      nextMargin="30"
      circular
      :autoplay="false"
      radius="5"
      bgColor="#ffffff"
    ></uv-swiper>
    <div>name {{ list.length }}</div>
    <uv-button text="月落"></uv-button>
  </view>
</template>

<script setup lang="ts">
import { ref } from 'vue';

import { mockUser, mockProductList } from '@/src/mock.js';

let list = [
  'https://i1.hdslb.com/bfs/archive/e92fab58ab53467b089674ecef19e758932aed8e.jpg@672w_378h_1c_!web-home-common-cover.avif',
  'https://i1.hdslb.com/bfs/archive/e92fab58ab53467b089674ecef19e758932aed8e.jpg@672w_378h_1c_!web-home-common-cover.avif',
  'https://i1.hdslb.com/bfs/archive/e92fab58ab53467b089674ecef19e758932aed8e.jpg@672w_378h_1c_!web-home-common-cover.avif'
];

// 定义响应式变量
const message = ref('Hello uni-app withacs Vue3!');

console.log('index app setup', mockUser());
</script>

<style lang="scss">
/* 页面样式 */
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  background-color: #f8f8f8;
}

.title {
  font-size: 24px;
  color: #333;
}
</style>
